<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="/favicon.ico"/>
    <title>咨询-{$store.nickname}</title>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <script>
        WEB_ROOT_URL = '{$basename}';
        WEB_STATIC_URL = '{$static}';
        WEB_FILE_URL = '/file';
        IS_DEBUG = {:env('APP_DEBUG')};
    </script>
    <link href="__STATIC__/layui/css/layui.css" rel="stylesheet">
    <script src="__libs__/push/pusher.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="__libs__/jquery/jquery.min.js"></script>
    <script src="__libs__/layui/layui.js" type="text/javascript"></script>
    <script src="__libs__/jquery/jquery.cookie.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="__style__/mobile/mobile.css?v=v={:time()}">
    <link rel="stylesheet" type="text/css" href="__style__/mobile/my.css?v=v={:time()}">
    <script src="__libs__/jquery/jquery.form.min.js" type="text/javascript"></script>
    <link href="__libs__/layer/skin/layer.css" type="text/css" rel="stylesheet" />
    <script src="__libs__/layer/layer.js" type="text/javascript"></script>
    <script type="text/javascript" src="__libs__/swiper-4.3.3.min.js"></script>
    <script type="text/javascript" src="__libs__/webrtc/recorder.js"></script>
    <script>

        var service_id = "{$chat.to_user_id}";
        var store_id = '{$store.id}';
        // 离线情况下获取消息间隔
        var offline_get_time = 3;
        var last_showtime = '';
        var history_chat_content_id = 0;
        var login_token = "{$customer.token.token}";
        var ws_domain = "ws://{$host}:{:config('gateway_worker.port')}";
        var now_chat_content_id = 0;

        var from_url = '{$from_url}';
        from_url.replace("%23", "#");
        from_url.replace("%26", "&");
        var login_user_id = "{$chat.user_id}";
        var visitor_id = "{$chat.user_id}";
        var my_chat_id = "{$chat.id}";
        var to_chat_id  = "{$chat.to_chat_id }";
        var to_user_id  = "{$chat.to_user_id }";
        var pic = "__image__/index/avatar-red2.png";
        var num;
        var t;

        var hintState = 'off';

        var myTitle = document.title;

        var isActive;
        var socket_try_connect_time = 3;
        var socket_try_connect_range = 10;
        var socket_is_connect = false;
        var socketTime = null;
        var socket;

        $.cookie("services", service_id);
        function a() {
            var e = document.getElementById("chat-message-audio-source").src
                , b = document.getElementById("chat-message-audio");
            b.src = "";
            var p = b.play();
            p && p.then(function(){}).catch(function(e){});
            b.src = e;
            $(document).unbind("click", a);
        }
        $(document).on("click", a);

    </script>

</head>
<body>
<audio id="chat-message-audio">
    <source id="chat-message-audio-source" src="__STATIC__/im/upload/voice/default.mp3" type="audio/mpeg" />
</audio>
<div id="container">
    <div class="bg">
        <div class="dialog">
            <div class="title">{$lang['evaluate_service']}</div>
            <div class="dialog-body">
                <div style="margin-bottom: 20px;">请对我的服务进行评价，满意请打5星哦~</div>
                <div class='evaluate-item evaluate-score' data-score="0">
                    <span class="evaluate-title">服务态度态度</span>
                    <img class="star" data-id="1" src="__image__/index/star.png" alt="">
                    <img class="star" data-id="2" src="__image__/index/star.png" alt="">
                    <img class="star" data-id="3" src="__image__/index/star.png" alt="">
                    <img class="star" data-id="4" src="__image__/index/star.png" alt="">
                    <img class="star" data-id="5" src="__image__/index/star.png" alt="">
                </div>
                <div class='evaluate-item' style="height: 80px;line-height: 1;margin-top: 10px;align-items: flex-start">
                    <span style="display: inline-block;margin-right: 12px;white-space: nowrap">意见意见建议</span>
                    <textarea class="about-text" name="" id="" cols="30" rows="4"></textarea>
                </div>
                <div class="evaluate-btn">
                    <button class="reset">取消</button>
                    <button class="submit">提交</button>
                </div>
            </div>
        </div>
    </div>
    <div class="offline"   {if $is_offline== 1} style="display: block;" {/if} >
    <div class="dialog">
        <div class="dialog-body">
            <div style="margin-bottom: 20px;">1</div>

            <div class='offline-item'>
                <div class="offline-title">姓名</div>
                <input placeholder="请输入您的姓名" id="offline_name" type="text">
            </div>
            <div class='offline-item'>
                <div class="offline-title">联系方式</div>
                <input placeholder="请输入您的联系方式" id="offline_mobile" type="number" onkeypress='return( /[\d]/.test(String.fromCharCode(event.keyCode)))'>
            </div>

            <div class="evaluate-btn">
                <button class="reset">取消</button>
                <button class="submit">提交</button>
            </div>
        </div>
    </div>
</div>
<a href="javascript:history.back(-1)" class="fanhui">
    <i class="layui-icon" style="position: absolute;left:10px;font-size: 20px;z-index: 999" >&#xe603;</i>
</a>
<div class="header" style="background-color: #{$theme}">
    <span id="services" style="color: #FFF;">{$chat.to_user.nickname}</span>
    <span id="status"></span>
    <span id='service_icon_enter'style="display:inline-block;margin-left: 5px;font-size: 12px;"></span>
</div>
<div class="content" id="wrap" style="background-color: #fff">
    <div style="height: 55px;width: 100%;"></div>
    <ul id="log" class="conversation" >

    </ul>
    <div style="height: 94px;width: 100%;"></div>
</div>
<div class="keyword">
    <div class="swiper-wrapper" id="question_key_list">
    </div>
</div>
<div class="foot_all" style="position:fixed;bottom:0px;width: 100%;height: 94px;padding:0;z-index: 999">

    <div class="tool_box">
        <div class="wl_faces_content">
            <div class="wl_faces_main">

            </div>
        </div>
    </div>
    <div class="foot_msg">
        <div class="footer">
            <input type="text" id="text_in" placeholder="请输入内容" class="layui-input" autocomplete="off"/>
            <button class="layui-btn layui-btn-normal send-btn" style="background-color: #{$theme}"
                    onclick="send()">发送
            </button>
        </div>
        <div class="msg-toolbar">
            <a id="face_icon" href="javascript:" onclick="faceon()"><img src="__image__/admin/b/smile.png" alt=""></a>
<!--            <a onclick="getaudio()"><img src="__image__/admin/b/smile.png" alt=""></a>-->
            <a id="images" href="javascript:">
                <form id="picture" enctype="multipart/form-data">
                    <div class="layui-box input-but  size">
                        <img src="__image__/admin/b/photo.png" alt="">
                        <input type="file" name="file" class="fileinput upload_image" onchange="uploadImage()"/>
                    </div>
                </form>
            </a>
            <a id="files" href="javascript:">
                <form id="file" enctype="multipart/form-data">
                    <div class="layui-box input-but  size">
                        <img src="__image__/admin/b/file.png" alt="">
                        <input type="file" name="file" class="fileinput upload_attachment" onchange="uploadFile()"/>
                    </div>
                </form>
            </a>
            <a onclick="hint()" id="clickbf" style="margin-top: 7px;"><i class="layui-icon state-mp3" style="font-size: 28px;cursor: pointer;color: #999999">&#xe685;</i></a>
        </div>
    </div>
</div>
</div>
<script>
    var please_select_images = "{$lang['please_select_images']}";
    var not_supported = "{$lang['not_supported']}";
    var no_data = "{$lang['no_data']}";
    var tip_waiting = "{$lang['tip_waiting']}";
    var tip = "{$lang['tip']}";
    var is_transfer_service = "{$lang['is_transfer_service']}";
    var yes = "{$lang['yes']}";
    var no = "{$lang['no']}";
    var transferring = "{$lang['transferring']}";
    var guess_ask = "{$lang['guess_ask']}";
    var please_enter_message = "{$lang['please_enter_message']}";
</script>

<script type="text/javascript" src="__script__/functions.js?v={:time()}"></script>
<script type="text/javascript" src="__script__/connect.js?v={:time()}"></script>
<script type="text/javascript" src="__script__/common.js?v={:time()}"></script>
<script type="text/javascript" src="__script__/index/inchat.js?v={:time()}"></script>
<script type="text/javascript" src="__script__/mobile/server.js?v={:time()}"></script>

<script>


    document.getElementById("wrap").onscroll = function(){
        var t =  document.getElementById("wrap").scrollTop;
        if( t == 0 ) {
            if($.cookie("cid") != ""){
                // getHistory(false);

                socketSend({chat_id:my_chat_id,chat_content_id: history_chat_content_id,my_chat_id:my_chat_id,to_chat_id:to_chat_id}, 'get_history')
            }
        }
    }

    var text = document.getElementById('text_in');
    // 获取焦点，拉到底部
    text.onfocus  = function() {
        $(".tool_box").hide();
        let height = +document.documentElement.clientHeight;
        setTimeout(function(){
            $('html ,body').animate({scrollTop: height}, 0);
        },200)
    }
    // 失去焦点，拉到顶部
    text.onblur = function() {
        setTimeout(function() {
            $('html ,body').animate({scrollTop: 0}, 0);
        },0)
    }

</script>
</body>
</html>
